<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="t" tagdir="/WEB-INF/tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<t:link />
<title>工具</title>
</head>

<style type="text/css">

/* body {
	font-size: 12px;
	font-family: "宋体", "微软雅黑";
} */
.login {
	position: absolute;
	top: 10%;
	left: 10%;
	width: 300px;
	height: 300px;
}

#content {
	width: 200px;
	height: 200px;
	border-bottom: solid 1px #316a91;
	margin: 5px auto 0 5px;
	background: #2E8B57;
}

#name {
	border: 0;
	width: 150px;
	height: 30px;
}

.btn {
	margin: 25px auto 0 25px;
	width: 100%;
	height: 40px;
	display: block;
	background: #66CDAA;
	border: 0;
}
</style>

<body>

	<div class="login">
		<div>
			<input type="text" id="name" placeholder="查询条件" required="required" />
		</div>
		<div id="con">
			<textarea id="content" name="content" style="">查询结果</textarea>
		</div>
		<button id="btn" type="button">查询手机归属地</button>
	</div>
</body>

<script>
	$("#btn").click(function() {
		$.ajax({
			url : "${pageContext.request.contextPath}/tool/phone",
			data : {
				tel : $("#name").val()
			},
			success : function(data) {
				$("#content").val(data);
			},
			error : function(data) {
				alert("未知错误!");
			}

		})
	})
</script>

</html>